{% extends "base_generic.html" %}
{% block content %}
<div class="container">
  <h2>借阅排行榜</h2>
  <ol style="padding-left: 24px;">
    {% for book in books %}
      <li style="margin-bottom: 18px;">
        <div class="card" style="display: flex; align-items: center; justify-content: space-between;">
          <div>
            <a href="{% url 'book-detail' book.pk %}" style="font-size: 1.1em; font-weight: bold;">{{ book.title }}</a>
            <span style="color: #888; margin-left: 10px;">借阅次数：{{ book.borrow_count }}</span>
          </div>
          <div>
            <span style="margin-left: 10px;">👍 {{ book.likes.count }}</span>
          </div>
        </div>
      </li>
    {% empty %}
      <li>暂无数据。</li>
    {% endfor %}
  </ol>
</div>
{% endblock %}
